@charset "UTF-8";

$windowWidth: 1920px;
$windowHeight: 1080px;
$bodyBackground: #052039;

// px单位转成vw单位
@function px2vw($size: 14px, $width: $windowWidth) {
  @if (type-of($size) == "number" and unit($size) == "px") {
    @return $size * 100vw / $width;
  } @else {
    @return $size;
  }
}

// px单位转成vh单位
@function px2vh($size: 14px, $width: $windowHeight) {
  @if (type-of($size) == "number" and unit($size) == "px") {
    @return $size * 100vh / $width;
  } @else {
    @return $size;
  }
}

//props-dpr
@mixin props-dpr($props, $values) {
  @if length($props) ==1 {
    @if length($values) ==1 {
      #{$props}: px2vw($values);
    } @else {
      $valueStr: ();

      @each $value in $values {
        $valueStr: append($valueStr, px2vw($value));
      }

      #{$props}: $valueStr;
    }
  } @else {
    @each $prop in $props {
      #{$prop}: px2vw(nth($values, index($props, $prop)));
    }
  }
}
.shade-box {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 101;
  background-color: rgba($color: #000000, $alpha: 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  .play-box {
    width: 50%;
    height: 70%;
    box-sizing: border-box;
    padding: px2vh(100px);
    // background: url("~@/assets/images/icon_videobox.png") no-repeat;
    background-size: 100% 100%;
  }
}
